<template>
    <vBreadcrumbVue></vBreadcrumbVue>
    <a-page-header :ghost="false" title="单号：234231029431">
        <template #extra>
            <a-button key="3">操作</a-button>
            <a-button key="2">操作</a-button>
            <a-button key="1" type="primary">主操作</a-button>
        </template>
        <a-descriptions size="small" :column="3">
            <a-descriptions-item label="创建人">张三丰</a-descriptions-item>
            <a-descriptions-item label="订购产品">
                <a>XX 服务</a>
            </a-descriptions-item>
            <a-descriptions-item label="创建时间">2017-01-10</a-descriptions-item>
            <a-descriptions-item label="生效日期">2017-10-10</a-descriptions-item>
            <a-descriptions-item label="备注">
                请于两个工作日内确认
            </a-descriptions-item>
        </a-descriptions>
        <template #footer>
            <a-tabs>
                <a-tab-pane key="1" tab="详情" />
                <a-tab-pane key="2" tab="规则" />
            </a-tabs>
        </template>
    </a-page-header>
    <div class="page-container">
        <a-card title="流程进度">
            <a-steps progress-dot :current="1">
                <a-step title="创建项目">
                    <template #description>
                        <span>曲丽丽</span>
                    </template>
                </a-step>
                <a-step title="部门初审" description="由玉溪" />
                <a-step title="财务复核" />
                <a-step title="完成" />
            </a-steps>
        </a-card>
        <a-card title="用户信息" style="margin-top:24px;">
            <a-card>
                <a-descriptions  :size="'small'">
                    <a-descriptions-item label="取货单号">1000000000</a-descriptions-item>
                    <a-descriptions-item label="状态">已取货</a-descriptions-item>
                    <a-descriptions-item label="销售单号">1234123421</a-descriptions-item>
                    <a-descriptions-item label="子订单">3214321432</a-descriptions-item>
                </a-descriptions>
                <a-divider></a-divider>
                <a-descriptions title="用户信息" :size="'small'">
                    <a-descriptions-item label="用户姓名">付小小</a-descriptions-item>
                    <a-descriptions-item label="联系电话">18100000000</a-descriptions-item>
                    <a-descriptions-item label="常用快递">菜鸟仓储</a-descriptions-item>
                    <a-descriptions-item label="取货地址">浙江省杭州市西湖区万塘路18号</a-descriptions-item>
                </a-descriptions>
            </a-card>
        </a-card>
    </div>
</template>

<script lang="ts" setup>

</script>

<style lang="less" scoped>
.page-container {
    margin: 24px 24px 0;
}
</style>